#edit-area {
    margin-top: 10px;
    position: relative;
    height: calc(100% - 66px);
    #tool-bar {
        position: absolute;
        width: 300px;
        height: 100%;
        nz-card {
            overflow: auto;
            margin-top: 0;
            height: 100%;
        }
        .tool-box {
            padding: 10px;
            text-align: center;
            background-color: gray;
            color: white;
            -moz-border-radius: 5px;
            -webkit-border-radius: 5px;
            border-radius: 5px;
        }
        .tool-box:hover {
            -moz-box-shadow: 2px 2px 5px lightgray;
            -webkit-box-shadow: 2px 2px 5px lightgray;
            box-shadow: 2px 2px 5px lightgray;
        }
    }
    #flow-container {
        border: 1px solid lightgray;
        background-color: black;
        margin-left: 310px;
        position: relative;
        overflow: auto;
        height: 100%;
        background-image: linear-gradient(90deg, rgba(0, 255, 213, 0.05) 10%, rgba(0, 0, 0, 0) 10%),
            linear-gradient(rgba(0, 255, 213, 0.05) 10%, rgba(0, 0, 0, 0) 10%);
        background-size: 20px 20px;
    }
}

.tranlate-view {
    transform: translate(-24px, -24px);
    -webkit-transform: translate(-24px, -24px);
    -moz-transform: translate(-24px, -24px);
}

.node {
    width: 200px;
    height: 50px;
    text-align: center;
    position: absolute;

    .connectable {
        display: inline-block;
        width: 50px;
        height: 50px;
        line-height: 50px;
        padding: 5px;
        background-color: darkgray;
        vertical-align: middle;
        cursor: crosshair;
    }
    .draggable {
        display: inline-block;
        width: calc(100% - 50px);
        height: 50px;
        line-height: 50px;
        font-size: 16px;
        background-color: lightslategray;
        vertical-align: middle;
        word-break: keep-all;
        overflow: hidden;
        text-overflow: ellipsis;
        cursor: move;
    }
}

.sborder {
    display: none;
    .lborder {
        height: 50px;
        width: 2px;
        top: 0px;
        left: 0px;
        background-color: wheat;
        position: absolute;
    }
    .rborder {
        height: 50px;
        width: 2px;
        top: 0px;
        left: 199px;
        background-color: wheat;
        position: absolute;
    }
    .tborder {
        height: 2px;
        width: 200px;
        top: 0px;
        left: 0px;
        background-color: wheat;
        position: absolute;
    }
    .bborder {
        height: 2px;
        width: 200px;
        top: 49px;
        left: 0px;
        background-color: wheat;
        position: absolute;
    }
}
